@import "../../assets/css/index.less";
.special-art-container {
    width: 3.1rem;
    height: 1.82rem;
    margin-bottom: 0.2rem;
    background: #000;
    position: relative;
    img {
        .tile-all();
        transition: all 500ms;
        opacity: 0.7;
    }
    .content-wrapper {
        position: absolute;
        z-index: 10;
        top: 30%;
        width: 100%;
        text-align: center;
        color: white;
        .readBtn {
            display: inline-block;
            cursor: pointer;
            border-radius: 50px;
            width: 0.8rem;
            padding: 0.04rem 0;
            border: 1px solid white;
            transition: all 500ms;
        }
    }
    &:hover {
        img {
            opacity: 0.9;
        }
        .readBtn {
            color: #ccc;
            opacity: 0.7;
            background: white;
        }
    }
}
